<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>GT pro钱包</title>
		<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
		<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
		<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
		<link rel="stylesheet" href="bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
		<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
		<link rel="stylesheet" href="dist/css/skins/skin-blue.min.css">
		<link rel="stylesheet" href="css/style.css">
		<link rel="stylesheet" href="css/card.css">
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">

		<link rel="stylesheet" href="bower_components/bootstrap-daterangepicker/daterangepicker.css">
		<link rel="stylesheet" href="bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css">
	</head>
	
	<body class="hold-transition skin-blue sidebar-mini">
		<div class="wrapper">
			<div class="content-wrapper">
				<section class="content-header">
					<ol class="breadcrumb">
						<li>
							<a href="#"><i class="fa fa-dashboard"></i>API管理</a>
						</li>
						<li class="active">API用户列表</li>
					</ol>
				</section>
				<section class="content">
					<div class="box">
						<div class="box-header with-border">
							API用户列表
						</div>
						<div class="box-body">
							<div class="buyu_search_group">
								<div class="row" style="margin-bottom:10px;">
									<!--<div class="col-xs-12 col-sm-6 col-lg-3">
										<div class="input-group margin">
											<div class="input-group-btn">
												<button type="button" class="btn btn-default" aria-expanded="false">用户ID</button>
											</div>
											<input type="text" class="form-control" id="id">
										</div>
									</div>-->
									<div class="col-xs-12 col-sm-6 col-lg-3">
										<div class="input-group margin">
											<div class="input-group-btn">
												<button type="button" class="btn btn-default" aria-expanded="false">手机号码</button>
											</div>
											<input type="text" class="form-control" id="phone">
										</div>
									</div>
									<div class="col-xs-12 col-sm-6 col-lg-3">
										<div class="input-group margin">
											<div class="input-group-btn">
												<button type="button" class="btn btn-default" aria-expanded="false">注册时间</button>
											</div>
											<!-- /btn-group -->
											<input type="text" class="form-control" id="select_time">
											<div class="input-group-addon clearBtns" onclick="clearRangeTime(this)">x</div>
										</div>
									</div>
									<!--<div class="col-xs-12 col-sm-6 col-lg-3">
										<div class="input-group margin">
											<div class="input-group-addon">
												登录时间
											</div>
											<input type="text" class="form-control pull-right" id="login_time">
											<div class="input-group-addon clearBtns" onclick="clearRangeTime(this)">x</div>
										</div>
									</div>-->
									<div class="col-xs-12 col-sm-6 col-lg-3">
										<button type="button" class="btn bg-primary margin" onclick="search()"><i class="fa fa-search" ></i>&nbsp;搜索</button>
										<button type="button" class="btn bg-primary margin" onclick="reset()"><i class="fa fa-trash" ></i>&nbsp;重置</button>
									</div>
								</div>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-12">
								<!-- /.box-header -->
								<div class="box-body">
									<table id="example" class="display nowrap table table-bordered table-striped" style="width:100%;">
										<thead>
											<tr>
												<th>用户id</th>
												<th>手机号码</th>
												<th>资产总额</th>
												<th>状态</th>
												<th>注册时间</th>
												<th>api申请时间</th>
											</tr>
										</thead>
										<tbody></tbody>
									</table>
								</div>
							</div>
						</div>
					</div>

				</section>
			</div>
		</div>
		<div class="modal fade parents in" id="toBlackModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">	                  				<span aria-hidden="true">×</span>								</button>
						<h4 class="modal-title">添加黑名单</h4> </div>
					<div class="modal-body">
						<form class="form-horizontal">
							<div class="box-body"> <input type="hidden" name="id" value="12">
								<p>是否将“<span name="name"></span>”移入黑名单</p>
								<label class="margin-bottom-none" style="width:100%;font-weight:normal;">
												拉黑到期时间：
												<input type="text" class="form-control" id="endTime"/>
											</label>
								<label class="margin-bottom-none" style="width:100%;font-weight:normal;">
												操作密码：
												<input type="password" class="form-control" name="OPassword">
											</label>

							</div>
						</form>
					</div>
					<div class="modal-footer"> <button type="button" class="btn btn-primary save" onclick="toBlackSave()">确定</button> </div>
				</div>
			</div>
		</div>
		<div class="modal fade parents in" id="apiSetrModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">	                  				<span aria-hidden="true">×</span>								</button>
						<h4 class="modal-title">API设置</h4> </div>
					<div class="modal-body">
						<form class="form-horizontal">
							<div class="box-body"> 
								<input type="hidden" name="id" value="">
								<p>是否<span name="doSuper">开启</span>id为“<span name="name"></span>”的API</p>
								<input type="hidden" name="api_status" />
							</div>
						</form>
					</div>
					<div class="modal-footer"> <button type="button" class="btn btn-primary save" onclick="setAPISave()">确定</button> </div>
				</div>
			</div>
		</div>
		<script src="bower_components/jquery/dist/jquery.min.js"></script>
		<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<script src="bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
		<script src="bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>

		<script src="bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
		<script src="bower_components/moment/min/moment.min.js"></script>
		<script src="bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>

		<script src="dist/js/adminlte.min.js"></script>
		<script src="js/argument.js"></script>
		<script src="js/fun.js"></script>
		<script src="js/nav.js"></script>
		<script src="js/pop.js"></script>
		<script type="text/javascript">
			$('#select_time').daterangepicker({
				timePicker: true,
				timePicker24Hour: true,
				autoUpdateInput: false,
				locale: {
					format: "YYYY-MM-DD HH:mm"
				}
			})

			var table = $('#example').DataTable({
				'ordering': false,
				'lengthChange': false,
				'searching': false,
				'info': true,
				"processing": true,
				"serverSide": true,
				'scrollX':true,
				"ajax": {
					"type": 'post',
					"url": url + "Back_UserList",
					"contentType": "application/x-www-form-urlencoded",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					"data": function(d) {
						var dataType ={
							phone:{type:'string',value:$("#phone").val()},
							start_time:{type:'time',value:$("#select_time").val().substring(0, 16)},
							end_time:{type:'time',value:$("#select_time").val().substring(19, 35)}
						}
						console.log(dataType)
						var Json = renderData(dataType);
						Json.page_num = d.start / 10 + 1;
						Json.is_api = 1;
						var data={};
						data.data = JSON.stringify(Json);
						return data;
					},
					"dataFilter": function(data) {
						var datajson = eval('(' + data + ')');
						if(datajson.status == 1000||datajson.status == 102) {
							ToLogin(datajson)
							return false;
						} else if(datajson.status != 1) {
							alert(datajson.error);
							return false;
						}
						var json = {};
						if(datajson.data == null) {
							json.recordsTotal = 0;
							json.recordsFiltered = 0;
							json.data = [];
							return JSON.stringify(json);
						} else {
							json.recordsTotal = datajson.data.total;
							json.recordsFiltered = datajson.data.total;
							json.data = datajson.data.data_list;
							return JSON.stringify(json);
						}
					}
				},
				"columns": [{
						data: 'id'
					},
					{
						data: 'phone'
					},
					{
						data: 'balance_sum'
					},
					
					{
						data: null,
						render: function(data) {
							var text = "关闭",
								active = "";
							if(data.api_status == 1) {
								text = "开启";
								active = "active";
							}
							return '<div class="fr_swich apiSet ' + active + '" data_Id="' + data.id + '"><div class="fr_swich_body"></div><span class="fr_swich_txt">' + text + ' </span></div></div>'

						}
					},
					{
						data: 'credit_balance'
					},
					{
						data: 'register_time'
					}
				]
			})
		</script>
		<script type="text/javascript">
			function setAPISave() {
				$.ajax({
					type: 'post',
					'contentType': "application/x-www-form-urlencoded",
					"headers": {
						"auth-token": localStorage.getItem("wallet_token")
					},
					url: url + 'Back_ApiStatusUpdate',
					data: {
						data:JSON.stringify({
							id:$("#apiSetrModal [name=id]").val(),
							api_status:$("#apiSetrModal [name=api_status]").val()
						})	
					},
					success: function(res) {
						if(res.status == 1000||res.status == 102) {
							ToLogin(res)
							return false;
						} else if(res.status != 1) {
							alert(res.error + ":" + res.data);
							return false;
						}
						$("#apiSetrModal").modal("hide");
						$("#apiSetrModal").find("[name=OPassword]").val("")
						move("success", "修改成功");
						table.draw(false);
					}
				})
			}

			$("#example").on("click", ".apiSet", function() {
				$("#apiSetrModal").find("[name=name]").text($(this).attr("data_Id"))
				$("#apiSetrModal").find("[name=id]").val($(this).attr("data_Id"))

				if($(this).hasClass("active")) {
					$("#apiSetrModal").find("[name=doSuper]").text("关闭")
					$("#apiSetrModal").find("[name=api_status]").val(2)
				} else {
					$("#apiSetrModal").find("[name=doSuper]").text("开启")
					$("#apiSetrModal").find("[name=api_status]").val(1)
				}
				$("#apiSetrModal").modal("show");
			})

			function checkDetails(id) {
				window.location.href = 'user_details.html?user_id=' + id;
			}
		</script>
	</body>

</html>